﻿<template>
  <baseConfigUI :config.sync="config" :events.sync="events">
    <template v-if="config.other.dataSource">
      <el-form-item label = "是否多选">
        <el-switch
          :disabled="config.other.dataSource.remoteCategory !== 'Meta'"
          v-model="config.other.isMulti">
        </el-switch>
      </el-form-item>
      <el-form-item label = "是否过滤逻辑删除资料">
        <el-switch
          v-model="config.other.isFilterDeleted">
        </el-switch>
      </el-form-item>
      <el-form-item label = "查询模式设置">
        <el-switch
          style="padding:0 0 5px 0"
          v-model="config.other.query.useDefault"
          active-text="默认模式"
          inactive-text="自定义模式">
        </el-switch>
      </el-form-item>
      <template>
        <el-tabs type="border-card" v-model="activeName">
          <el-tab-pane name="dataSource" label="数据源设定">
            <el-radio-group v-model="config.other.dataSource.remoteCategory" @change="changRemoteCategory">
              <el-radio-button label="MetaPop">元数据引用栏位</el-radio-button>
              <el-radio-button label="Meta">元数据表</el-radio-button>
            </el-radio-group>
            <template v-if="config.other.dataSource.remoteCategory === 'MetaPop'">
              <el-select v-model="config.other.dataSource.MetaPopSettings.table" filterable  placeholder="请选择" @change="changePopMeta">
                <el-option
                  v-for="(item,index) in metatables"
                  :key="index"
                  :label="item.desc"
                  :value="item.uid">
                  <span style="float: left">{{ item.desc }}</span>
                  <span style="float: right; color: #8492a6; font-size: 13px">{{ item.name }}</span>
                </el-option>
              </el-select>
              <el-divider></el-divider>
              <el-form-item label = "含引用值栏位">
                <el-select v-model="config.other.dataSource.MetaPopSettings.column" filterable  placeholder="请选择" @change="changePopMetaColumn">
                  <el-option
                    v-for="(item,index) in metaColumns"
                    :key="index"
                    :label="item.column_desc"
                    :value="item.column_name">
                    <span style="float: left">{{ item.column_desc }}</span>
                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.column_name }}</span>
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label = "栏位设定">
                <el-table :data = 'config.other.table.columns' max-height="300" style = "width:100%" empty-text = "暂无数据" border stripe>
                  <el-table-column align = "center" width="100" fixed prop = 'name' label = '栏位名称'>
                  </el-table-column>
                  <el-table-column align = "center" width="200" prop = 'label' label = '栏位描述'>
                    <template slot-scope="scope">
                      <el-input v-model = "scope.row.label" placeholder = '请输入'></el-input>
                    </template>
                  </el-table-column>
                  <el-table-column align = "center" prop = 'visible' label = '是否显示'>
                    <template slot-scope="scope">
                      <el-switch
                        v-model="scope.row.visible"
                        active-color="#13ce66"
                        inactive-color="#ff4949">
                      </el-switch>
                    </template>
                  </el-table-column>
                  <el-table-column align = "center" prop = 'width' label = '栏位宽度'>
                    <template slot-scope="scope">
                      <el-input v-model = "scope.row.width" placeholder = '请输入'></el-input>
                    </template>
                  </el-table-column>
                  <el-table-column align = "center" prop = 'sortable' label = '允许排序'>
                    <template slot-scope="scope">
                      <el-switch
                        v-model="scope.row.sortable"
                        active-color="#13ce66"
                        inactive-color="#ff4949">
                      </el-switch>
                    </template>
                  </el-table-column>
                  <el-table-column align = "center" width="150" prop = 'sortCustom' label = '排序方式'>
                    <template slot-scope="scope">
                      <el-switch
                        v-model="scope.row.sortCustom"
                        active-color="#13ce66"
                        inactive-color="#ff4949"
                        active-text="后端"
                        inactive-text="前端">
                      </el-switch>
                    </template>
                  </el-table-column>
                  <el-table-column align = "center" prop = 'sort' label = '显示顺序'>
                    <template slot-scope="scope">
                      <el-input v-model = "scope.row.sort" placeholder = '请输入'></el-input>
                    </template>
                  </el-table-column>
                </el-table>
              </el-form-item>
              <el-form-item label = "固定过滤条件">
                <label class="tips">提示:值设定请参考知识库中的<a target="_blank" href="http://fjkb.whfjwl.com/mdShow.html?defaultPk=%7B%22defaultPk%22%3A%224c83f52d-e6c4-4d85-a143-507a852399ca%22%2C%22version%22%3A%221.0.0%22%7D">【ICP前端框架新版设计】</a>中的“事件词典表”</label>
                <div>
                  <el-button style="float: right; padding: 3px 0" type="text" @click="addFilter">添加</el-button>
                  <div>
                    <el-table :data = 'config.other.dataSource.MetaPopSettings.filterList' style = "width:100%" empty-text = "暂无数据，请添加" border stripe>
                      <el-table-column align = "center" prop = 'text' label = '栏位'>
                        <template slot-scope = "scope">
                          <el-select v-model="scope.row.column" clearable placeholder="请选择">
                            <el-option
                              v-for="(item,index) in refColumns"
                              :key="index"
                              :label="item.column_desc"
                              :value="item.column_name">
                              <span style="float: left">{{ item.column_desc }}</span>
                              <span style="float: right; color: #8492a6; font-size: 13px">{{ item.column_name }}</span>
                            </el-option>
                          </el-select>
                        </template>
                      </el-table-column>
                      <el-table-column align = "center" prop = 'sort' label = '条件'>
                        <template slot-scope="scope">
                          <el-select v-model="scope.row.condition" clearable placeholder="请选择">
                            <el-option
                              v-for="(item,index) in conditionOps"
                              :key="index"
                              :label="item.label"
                              :value="item.value">
                              <span style="float: left">{{ item.label }}</span>
                              <span style="float: right; color: #8492a6; font-size: 13px">{{ item.value }}</span>
                            </el-option>
                          </el-select>
                        </template>
                      </el-table-column>
                      <el-table-column align = "center" prop = 'settings' label = '值设定'>
                        <template slot-scope="scope">
                          <el-input v-model="scope.row.value" placeholder="请输入内容"></el-input>
                        </template>
                      </el-table-column>
                      <el-table-column align = "center" label = "操作" width = "50">
                        <template slot-scope = "scope">
                          <el-button type = "text" size = "mini" @click = "handleFilterRemove(scope.$index)" title = '移除'>
                            <i class = "iconfont icon-shanchu"></i>
                          </el-button>
                        </template>
                      </el-table-column>
                    </el-table>
                  </div>
                </div>
              </el-form-item>
              <el-form-item label = "排序设定">
                <el-button style="float: right; padding: 3px 0" type="text" @click="addPopOrderBy">添加</el-button>
                  <div>
                    <el-table :data = 'config.other.dataSource.MetaPopSettings.orderList' style = "width:100%" empty-text = "暂无数据，请添加" border stripe>
                      <el-table-column align = "center" prop = 'text' label = '栏位'>
                        <template slot-scope = "scope">
                          <el-select v-model="scope.row.column" clearable placeholder="请选择">
                            <el-option
                              v-for="(item,index) in metaColumns"
                              :key="index"
                              :label="item.column_desc"
                              :value="item.column_name">
                              <span style="float: left">{{ item.column_desc }}</span>
                              <span style="float: right; color: #8492a6; font-size: 13px">{{ item.column_name }}</span>
                            </el-option>
                          </el-select>
                        </template>
                      </el-table-column>
                      <el-table-column align = "center" prop = 'sort' label = '排序'>
                        <template slot-scope="scope">
                          <el-select v-model="scope.row.direction" clearable placeholder="请选择">
                            <el-option
                              v-for="(item,index) in orderOptions"
                              :key="index"
                              :label="item.label"
                              :value="item.value">
                            </el-option>
                          </el-select>
                        </template>
                      </el-table-column>
                      <el-table-column align = "center" label = "操作" width = "50">
                        <template slot-scope = "scope">
                          <el-button type = "text" size = "mini" @click = "handlePopOrderRemove(scope.$index)" title = '移除'>
                            <i class = "iconfont icon-shanchu"></i>
                          </el-button>
                        </template>
                      </el-table-column>
                    </el-table>
                  </div>
              </el-form-item>
            </template>
            <template v-if="config.other.dataSource.remoteCategory === 'Meta'">
              <el-select v-model="config.other.dataSource.MetaSettings.table" filterable  placeholder="请选择" @change="changeMeta">
                <el-option
                  v-for="(item,index) in metatables"
                  :key="index"
                  :label="item.desc"
                  :value="item.uid">
                  <span style="float: left">{{ item.desc }}</span>
                  <span style="float: right; color: #8492a6; font-size: 13px">{{ item.name }}</span>
                </el-option>
              </el-select>
              <el-divider></el-divider>
              <el-form-item label = "栏位设定">
                <el-table :data = 'config.other.table.columns' max-height="300" style = "width:100%" empty-text = "暂无数据" border stripe>
                  <el-table-column align = "center" width="100" fixed prop = 'name' label = '栏位名称'>
                  </el-table-column>
                  <el-table-column align = "center" width="200" prop = 'label' label = '栏位描述'>
                    <template slot-scope="scope">
                      <el-input v-model = "scope.row.label" placeholder = '请输入'></el-input>
                    </template>
                  </el-table-column>
                  <el-table-column align = "center" prop = 'visible' label = '是否显示'>
                    <template slot-scope="scope">
                      <el-switch
                        v-model="scope.row.visible"
                        active-color="#13ce66"
                        inactive-color="#ff4949">
                      </el-switch>
                    </template>
                  </el-table-column>
                  <el-table-column align = "center" prop = 'width' label = '栏位宽度'>
                    <template slot-scope="scope">
                      <el-input v-model = "scope.row.width" placeholder = '请输入'></el-input>
                    </template>
                  </el-table-column>
                  <el-table-column align = "center" prop = 'sortable' label = '允许排序'>
                    <template slot-scope="scope">
                      <el-switch
                        v-model="scope.row.sortable"
                        active-color="#13ce66"
                        inactive-color="#ff4949">
                      </el-switch>
                    </template>
                  </el-table-column>
                  <el-table-column align = "center" width="150" prop = 'sortCustom' label = '排序方式'>
                    <template slot-scope="scope">
                      <el-switch
                        v-model="scope.row.sortCustom"
                        active-color="#13ce66"
                        inactive-color="#ff4949"
                        active-text="后端"
                        inactive-text="前端">
                      </el-switch>
                    </template>
                  </el-table-column>
                  <el-table-column align = "center" prop = 'sort' label = '显示顺序'>
                    <template slot-scope="scope">
                      <el-input v-model = "scope.row.sort" placeholder = '请输入'></el-input>
                    </template>
                  </el-table-column>
                </el-table>
              </el-form-item>
              <el-form-item label = "valueKey设定">
                <el-select v-model="config.other.dataSource.MetaSettings.valueKey" filterable  placeholder="请选择">
                  <el-option
                    v-for="(item,index) in metaColumns"
                    :key="index"
                    :label="item.column_desc"
                    :value="item.column_name">
                    <span style="float: left">{{ item.column_desc }}</span>
                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.column_name }}</span>
                  </el-option>
              </el-select>
              </el-form-item>
              <el-form-item label = "labelKey设定">
                <el-select v-model="config.other.dataSource.MetaSettings.labelKey" filterable  placeholder="请选择">
                  <el-option
                    v-for="(item,index) in metaColumns"
                    :key="index"
                    :label="item.column_desc"
                    :value="item.column_name">
                    <span style="float: left">{{ item.column_desc }}</span>
                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.column_name }}</span>
                  </el-option>
                </el-select>`
              </el-form-item>
              <el-form-item label="默认查询栏位绑定" v-if="config.other.query.useDefault">
                <el-select v-model="config.other.query.filterColumns" multiple filterable  placeholder="请选择">
                  <el-option
                    v-for="(item,index) in metaColumns"
                    :key="index"
                    :label="item.column_desc"
                    :value="item.column_name">
                    <span style="float: left">{{ item.column_desc }}</span>
                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.column_name }}</span>
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label = "过滤设定">
                <label class="tips">提示:值设定请参考知识库中的<a target="_blank" href="http://fjkb.whfjwl.com/mdShow.html?defaultPk=%7B%22defaultPk%22%3A%224c83f52d-e6c4-4d85-a143-507a852399ca%22%2C%22version%22%3A%221.0.0%22%7D">【ICP前端框架新版设计】</a>中的“事件词典表”</label>
                <div>
                  <el-button style="float: right; padding: 3px 0" type="text" @click="addMetaFilter">添加</el-button>
                  <div>
                    <el-table :data = 'config.other.dataSource.MetaSettings.filterList' style = "width:100%" empty-text = "暂无数据，请添加" border stripe>
                      <el-table-column align = "center" prop = 'text' label = '栏位'>
                        <template slot-scope = "scope">
                          <el-select v-model="scope.row.column" clearable placeholder="请选择">
                            <el-option
                              v-for="(item,index) in metaColumns"
                              :key="index"
                              :label="item.column_desc"
                              :value="item.column_name">
                              <span style="float: left">{{ item.column_desc }}</span>
                              <span style="float: right; color: #8492a6; font-size: 13px">{{ item.column_name }}</span>
                            </el-option>
                          </el-select>
                        </template>
                      </el-table-column>
                      <el-table-column align = "center" prop = 'sort' label = '条件'>
                        <template slot-scope="scope">
                          <el-select v-model="scope.row.condition" clearable placeholder="请选择">
                            <el-option
                              v-for="(item,index) in conditionOps"
                              :key="index"
                              :label="item.label"
                              :value="item.value">
                              <span style="float: left">{{ item.label }}</span>
                              <span style="float: right; color: #8492a6; font-size: 13px">{{ item.value }}</span>
                            </el-option>
                          </el-select>
                        </template>
                      </el-table-column>
                      <el-table-column align = "center" prop = 'settings' label = '值设定'>
                        <template slot-scope="scope">
                          <el-input v-model="scope.row.value" placeholder="请输入内容"></el-input>
                        </template>
                      </el-table-column>
                      <el-table-column align = "center" label = "操作" width = "50">
                        <template slot-scope = "scope">
                          <el-button type = "text" size = "mini" @click = "handleMetaFilterRemove(scope.$index)" title = '移除'>
                            <i class = "iconfont icon-shanchu"></i>
                          </el-button>
                        </template>
                      </el-table-column>
                    </el-table>
                  </div>
                </div>
              </el-form-item>
              <el-form-item label = "排序设定">
                <el-button style="float: right; padding: 3px 0" type="text" @click="addMetaOrderBy">添加</el-button>
                  <div>
                    <el-table :data = 'config.other.dataSource.MetaSettings.orderList' style = "width:100%" empty-text = "暂无数据，请添加" border stripe>
                      <el-table-column align = "center" prop = 'text' label = '栏位'>
                        <template slot-scope = "scope">
                          <el-select v-model="scope.row.column" clearable placeholder="请选择">
                            <el-option
                              v-for="(item,index) in metaColumns"
                              :key="index"
                              :label="item.column_desc"
                              :value="item.column_name">
                              <span style="float: left">{{ item.column_desc }}</span>
                              <span style="float: right; color: #8492a6; font-size: 13px">{{ item.column_name }}</span>
                            </el-option>
                          </el-select>
                        </template>
                      </el-table-column>
                      <el-table-column align = "center" prop = 'sort' label = '排序'>
                        <template slot-scope="scope">
                          <el-select v-model="scope.row.direction" clearable placeholder="请选择">
                            <el-option
                              v-for="(item,index) in orderOptions"
                              :key="index"
                              :label="item.label"
                              :value="item.value">
                            </el-option>
                          </el-select>
                        </template>
                      </el-table-column>
                      <el-table-column align = "center" label = "操作" width = "50">
                        <template slot-scope = "scope">
                          <el-button type = "text" size = "mini" @click = "handleMetaOrderRemove(scope.$index)" title = '移除'>
                            <i class = "iconfont icon-shanchu"></i>
                          </el-button>
                        </template>
                      </el-table-column>
                    </el-table>
                  </div>
              </el-form-item>
            </template>
          </el-tab-pane>
        </el-tabs>
    </template>
    </template>
  </baseConfigUI>
</template>
<script>
import baseConfigUI from '../baseConfigUI.vue'
import {parseRefExpress} from '../common'
export default {
  components: {baseConfigUI},
  props: ['config', 'events'],
  data () {
    return {
      alltables: [],
      metatables: [],
      metaColumns: [],
      refColumns: [],
      activeName: 'dataSource',
      conditionOps: [{
        label: '等于',
        value: '$eq'
      }, {
        label: '大于',
        value: '$gt'
      }, {
        label: '大于等于',
        value: '$gte'
      }, {
        label: '小于',
        value: '$lt'
      }, {
        label: '小于等于',
        value: '$lte'
      }, {
        label: '模糊比对',
        value: '$like'
      }, {
        label: 'in',
        value: '$in'
      }],
      orderOptions: [{
        label: '升序',
        value: 'asc'
      }, {
        label: '降序',
        value: 'desc'
      }]
    }
  },
  mounted () {
    if (!this.config.other.table) {
      this.$set(this.config.other, 'table', {
        columns: [{
          name: 'column',
          label: '栏位1',
          visible: true,
          width: '',
          sort: 0,
          data_type: '',
          sortable: false,
          sortCustom: false
        }]
      })
    }
    if (!this.config.other.dataSource) {
      this.$set(this.config.other, 'dataSource', {
        category: 'remote',
        remoteCategory: 'MetaPop',
        MetaPopSettings: {
          table: '',
          column: '',
          orderList: [],
          filterList: [],
          valueKey: '',
          labelKey: ''
        },
        MetaSettings: {
          table: '',
          filterList: [],
          orderList: [],
          valueKey: '',
          labelKey: ''
        }
      })
    }
    if (!this.config.other.dataSource.MetaPopSettings) {
      this.$set(this.config.other.dataSource, 'MetaPopSettings', {
        table: '',
        column: '',
        orderList: [],
        filterList: [],
        valueKey: '',
        labelKey: ''
      })
    }
    if (!this.config.other.dataSource.MetaSettings) {
      this.$set(this.config.other.dataSource, 'MetaSettings', {
        table: '',
        filterList: [],
        orderList: [],
        valueKey: '',
        labelKey: ''
      })
    }
    let self = this
    if (!this.metatables || this.metatables.length <= 0) {
      self.alltables = this.$store.state.commonData.alltables
      this.$nextTick(() => {
        self.metatables = self.alltables.filter(v => {
          return v.category_no !== 'DIC'
        })
        if (self.config.other.dataSource.remoteCategory === 'MetaPop') {
          self.initPopMeta()
        } else if (this.config.other.dataSource.remoteCategory === 'Meta') {
          self.initMeta()
        }
      })
    }
    if (Object.keys(this.config.other).indexOf('isFilterDeleted') < 0) {
      this.config.other.isFilterDeleted = true
    }
    if (!this.config.other.query) {
      this.$set(this.config.other, 'query', {
        useDefault: true,
        conditions: [],
        filterColumns: []
      })
    }
    if (Object.keys(this.config.other).indexOf('isMulti') < 0) {
      this.$set(this.config.other, 'isMulti', false)
    }
  },
  methods: {
    initMeta () {
      let self = this
      var item = this.metatables.find(v => {
        return v.uid === self.config.other.dataSource.MetaSettings.table
      })
      if (item) {
        this.metaColumns = item.columns
      }
    },
    initPopMeta () {
      let self = this
      var item = this.metatables.find(v => {
        return v.uid === self.config.other.dataSource.MetaPopSettings.table
      })
      if (item) {
        this.metaColumns = item.columns.filter(col => {
          return col.ui_type === 'Pop' || col.ui_type === 'MultiPop'
        })
      }
      this.initPopMetaColumn()
    },
    initPopMetaColumn () {
      this.refColumns = []
      let self = this
      if (this.config.other.dataSource.MetaPopSettings.column) {
        var item = this.metatables.find(v => {
          return v.uid === self.config.other.dataSource.MetaPopSettings.table
        })
        if (!item) return
        let column = item.columns.find(col => {
          return col.column_name === self.config.other.dataSource.MetaPopSettings.column
        })
        let refobj = parseRefExpress(column)
        if (!refobj.ref_table) return
        let refinfo = this.alltables.find(v => {
          return v.name === refobj.ref_table
        })
        if (refinfo) {
          this.refColumns = refinfo.columns
        }
      }
    },
    changRemoteCategory () {
      if (this.config.other.dataSource.remoteCategory === 'MetaPop') {
        this.config.other.dataSource.MetaPopSettings = {
          table: '',
          column: '',
          orderList: [],
          filterList: [],
          valueKey: '',
          labelKey: ''
        }
      } else if (this.config.other.dataSource.remoteCategory === 'Meta') {
        this.config.other.dataSource.MetaSettings = {
          table: '',
          filterList: [],
          orderList: [],
          valueKey: '',
          labelKey: ''
        }
      }
    },
    changeMeta () {
      this.metaColumns = []
      this.config.other.table.columns = []
      this.config.other.dataSource.MetaSettings.valueKey = ''
      this.config.other.dataSource.MetaSettings.labelKey = ''
      this.config.other.dataSource.MetaSettings.filterList = []
      this.config.other.dataSource.MetaSettings.orderList = []
      let self = this
      var item = this.metatables.find(v => {
        return v.uid === self.config.other.dataSource.MetaSettings.table
      })
      if (item) {
        this.metaColumns = item.columns
        item.columns.forEach((item, index) => {
          self.config.other.table.columns.push({
            name: item.column_name,
            label: item.column_desc,
            visible: !item.column_name.startsWith('_'),
            width: '',
            sort: index,
            data_type: item.data_type,
            ui_type: item.ui_type,
            sortable: false,
            sortCustom: false
          })
        })
      }
    },
    changePopMeta () {
      this.metaColumns = []
      this.config.other.dataSource.MetaPopSettings.column = ''
      let self = this
      var item = this.metatables.find(v => {
        return v.uid === self.config.other.dataSource.MetaPopSettings.table
      })
      if (item) {
        this.metaColumns = item.columns.filter(col => {
          return col.ui_type === 'Pop' || col.ui_type === 'MultiPop'
        })
      }
      this.changePopMetaColumn()
    },
    changePopMetaColumn () {
      this.refColumns = []
      this.config.other.table.columns = []
      let self = this
      if (this.config.other.dataSource.MetaPopSettings.column) {
        var item = this.metatables.find(v => {
          return v.uid === self.config.other.dataSource.MetaPopSettings.table
        })
        if (!item) return
        let column = item.columns.find(col => {
          return col.column_name === self.config.other.dataSource.MetaPopSettings.column
        })
        if (!column) return
        if (column.ui_type === 'MultiPop') this.config.other.isMulti = true
        else this.config.other.isMulti = false
        let refobj = parseRefExpress(column)
        if (!refobj.ref_table) return
        let refinfo = this.alltables.find(v => {
          return v.name === refobj.ref_table
        })
        this.config.other.dataSource.MetaPopSettings.valueKey = refobj.ref_key_column
        this.config.other.dataSource.MetaPopSettings.labelKey = refobj.text
        if (refinfo) {
          this.refColumns = refinfo.columns
          // 表格栏位设定
          if (refobj.show) {
            refobj.show.forEach(s => {
              let cinfo = refinfo.columns.find(c => {
                return c.column_name === s
              })
              if (cinfo) {
                self.config.other.table.columns.push({
                  name: cinfo.column_name,
                  label: cinfo.column_desc,
                  visible: true,
                  width: '',
                  sort: self.config.other.table.columns.length,
                  data_type: cinfo.data_type,
                  ui_type: cinfo.ui_type,
                  sortable: false,
                  sortCustom: false
                })
              }
            })
          } else {
            let cinfo = refinfo.columns.find(c => {
              return c.column_name === refobj.text
            })
            if (cinfo) {
              self.config.other.table.columns = []
              self.config.other.table.columns.push({
                name: cinfo.column_name,
                label: cinfo.column_desc,
                visible: true,
                width: '',
                sort: self.config.other.table.columns.length,
                data_type: cinfo.data_type,
                ui_type: cinfo.ui_type,
                sortable: false,
                sortCustom: false
              })
            }
          }
        }
      }
    },
    addFilter () {
      this.config.other.dataSource.MetaPopSettings.filterList.push({
        column: '',
        condition: '',
        value: ''
      })
    },
    addMetaFilter () {
      this.config.other.dataSource.MetaSettings.filterList.push({
        column: '',
        condition: '',
        value: ''
      })
    },
    addPopOrderBy () {
      this.config.other.dataSource.MetaPopSettings.orderList.push({
        column: '',
        direction: 'asc'
      })
    },
    addMetaOrderBy () {
      this.config.other.dataSource.MetaSettings.orderList.push({
        column: '',
        direction: 'asc'
      })
    },
    handleAddChildren (row, index) {
      if (!row.children) {
        this.$set(row, 'children', [])
        row.children = []
      }
      row.children.push({
        uid: Date.parse(new Date()) + '_' + Math.ceil(Math.random() * 999999),
        code: '',
        value: '',
        disabled: false
      })
    },
    handlePopOrderRemove (index) {
      this.config.other.dataSource.MetaPopSettings.orderList.splice(index, 1)
    },
    handleFilterRemove (index) {
      this.config.other.dataSource.MetaPopSettings.filterList.splice(index, 1)
    },
    handleMetaOrderRemove (index) {
      this.config.other.dataSource.MetaSettings.orderList.splice(index, 1)
    },
    handleMetaFilterRemove (index) {
      this.config.other.dataSource.MetaSettings.filterList.splice(index, 1)
    }
  }
}
</script>
<style scoped>
.el-cascader-menu {
    max-height: 300px;
}
</style>
